<lv-group>
  <input
    #input
    lv-input
    autocomplete="off"
    class="lv-spinner-input"
    [attr.min]="min"
    [attr.max]="max"
    [attr.step]="step"
    [disabled]="disabled || null"
    [placeholder]="placeholder"
    [readonly]="readonly"
    [value]="value === 0 ? '0' : value || null"
    (keydown)="onKeyDown($event)"
    (compositionstart)="onCompositionstart()"
    (compositionend)="onCompositionend($event, input.value, input)"
    (keypress)="onKeyPress($event)"
    (input)="onInput($event, input.value, input)"
  />
  <button
    *ngIf="!onlyInput"
    lv-button
    class="lv-spinner-button lv-spinner-less-button"
    [ngClass]="{ 'lv-spinner-less-disabled': lessDisabled }"
    [lvType]="'link'"
    [disabled]="disabled || lessDisabled ? true : null"
    lvSize="auto"
    (mousedown)="reduce($event)"
    (mouseup)="stop()"
    (mouseleave)="stop()"
  >
    <i lv-icon="lv-icon-less"></i>
  </button>
  <button
    *ngIf="!onlyInput"
    lv-button
    class="lv-spinner-button lv-spinner-plus-button"
    [ngClass]="{ 'lv-spinner-plus-disabled': plusDisabled }"
    [lvType]="'link'"
    [disabled]="disabled || plusDisabled ? true : null"
    lvSize="auto"
    (mousedown)="add($event)"
    (mouseup)="stop()"
    (mouseleave)="stop()"
  >
    <i lv-icon="lv-icon-plus"></i>
  </button>
</lv-group>
